<template>
  <div>
    他是儿子
    <p>爸爸给的钱: {{money}}</p>
    <p>爸爸给的车: {{car}}</p>
    <button @click="pay">败家子要花钱</button>
    <button @click="changeCar">败家子要换车</button>
  </div>
</template>

<script>
export default {
  props: {
    money: {
      type: Number,
      default: 0
    },
    car: {
      type: String,
      default: '小黄车'
    }
  },
  setup (props, context) {
    // setup的两个参数  第一个是props  第二个参数挂载了emit方法等
    const pay = () => {
      //vue2中 this.$emit('自定义事件', 传递的值)
      // vue3中 context.emit('自定义事件', 传递的值)
      console.log('props', props)
      console.log('context', context)
      context.emit('handlePay', 90)
    }

    const changeCar = () => {
       context.emit('update:car', '拖拉机')
    }
    const sayHi = () => {
      console.log('hello 栓Q')
    }
    return {
      pay,
      changeCar,
      sayHi
    }
  }
}
</script>

<style>

</style>
